/**
 * @author lulongwen
 * Date: 2023-06-10 22:46
 * Description:
 */


// import React from 'react';
import { Card, Row, Col } from 'antd';
import {
  OverviewFlow,
} from '@/components';

const dataSource = [
  {
    title: 'Reactflow 特性',
    name: 'Feature',
    component: OverviewFlow,
  },
];

ReactflowApi.propTypes = {};

function ReactflowApi() {
  return (
    <Row gutter={24}>
      {dataSource.map((item, i) => {
        return <ApiItem {...item} key={i} />;
      })}
    </Row>
  );
}

export default ReactflowApi;

const bodyStyle = { height: 260 };

function ApiItem(props: any) {
  const { name, title, component } = props;
  const Element = component;

  return (
    <Col span={8}>
      <Card
        title={`${name} ${title}`}
        bodyStyle={bodyStyle}
      >
        <Element
          thumbnail
        />
      </Card>
    </Col>
  );
}
